<template>
  <div>
    <el-card>
      <el-descriptions class="margin-top" title="简介" :column="2" border>
        <template slot="extra">
          <el-button type="primary">操作</el-button>
        </template>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-s-custom"></i>
            用户名
          </template>
          {{ Props.UserInfo.User }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-male"></i>
            <i class="el-icon-female"></i>
            代理分成
          </template>
          <el-tag size="small"> {{ Props.UserInfo.AgentDiscount }}%</el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-location-outline"></i>
            登录Ip
          </template>
          {{ Props.UserInfo.LoginIp }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-office-building"></i>
            登录时间
          </template>
          {{ 时间_时间戳到时间(Props.UserInfo.LoginTime) }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-office-building"></i>
            注册时间
          </template>
          <div class="工具栏">
            {{时间_时间戳到时间(Props.UserInfo.RegisterTime)}}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-message"></i>
            手机
          </template>
          {{ Props.UserInfo.Phone }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-message"></i>
            QQ
          </template>
          {{ Props.UserInfo.Qq }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <i class="el-icon-message"></i>
            邮箱Email
          </template>
          {{ Props.UserInfo.Email }}
        </el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script setup>
import {快验系统更新} from "@/api/快验个人中心api.js";
import {ElMessage} from "element-plus";

const Props = defineProps({
  UserInfo: {
    type: Object,
    default: {
      AgentDiscount:0,
      Email:"",
      Id:0,
      LoginAppid:0,
      LoginIp:"",
      LoginTime:0,
      Note:"",
      PassWord:"",
      Phone:"",
      Qq:"",
      RealNameAttestation:"",
      RegisterIp:"",
      RegisterTime:0,
      Rmb:0,
      Status:1,
      SuperPassWord:"",
      UPAgentId:2,
      User:"",
    }
  }
})

const 时间_时间戳到时间 = (Time) => {
  var date = new Date(Time * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
  var Y = date.getFullYear() + '-';
  var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var D = date.getDate() + ' ';

  if (D.length === 2) {
    D = "0" + D
  }

  var h = date.getHours() + ':';
  if (h.length === 2) {
    h = "0" + h
  }
  var m = date.getMinutes() + ':';
  if (m.length === 2) {
    m = "0" + m
  }

  var s = date.getSeconds().toString();
  if (s.length === 1) {
    s = "0" + s
  }
  return Y + M + D + h + m + s;
}
</script>

<style scoped lang="scss">
.img {
  width: 80px;
  height: 80px;
}

.工具栏 {
  margin: 7px 8px 8px;


  padding-right: 1px;

  .el-icon {
    /*设置边框阴影*/
    font-size: 16px;
    margin-left: 10px;
    padding: 5px;
    border: 1px solid rgb(235, 238, 245);
    color: #409EFF;
    speak: none;
    font-style: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: baseline;
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    cursor: pointer;
  }
}
</style>
